page {
  --font-color-primary: rgba(0, 0, 0, 0.88);
  --font-color-secendary: rgba(0, 0, 0, 0.5);
  --font-color-idal: rgba(0, 0, 0, 0.3);

  --color-primary: rgb(0, 0, 0, 0.88);
  --border-color: rgba(0, 0, 0, 0.1);
  --border-idal-color: rgba(0, 0, 0, 0.05);

  --color-black-00: rgba(0, 0, 0, 0.05);
  --color-black-01: rgba(0, 0, 0, 0.1);
  --color-black-02: rgba(0, 0, 0, 0.2);
  --color-black-03: rgba(0, 0, 0, 0.3);
  --color-black-04: rgba(0, 0, 0, 0.4);
  --color-black-05: rgba(0, 0, 0, 0.5);
  --color-black-06: rgba(0, 0, 0, 0.6);
  --color-black-07: rgba(0, 0, 0, 0.7);
  --color-black-08: rgba(0, 0, 0, 0.8);
  --color-black-09: rgba(0, 0, 0, 0.9);
  --color-black-10: rgba(0, 0, 0, 1);

  --background-color: rgba(0, 0, 0, 0.02);
  --bg-active-color: rgba(0, 0, 0, 0.04);

  --px0d5: 0.5px;
  --px1: 1px;
  --px2: 2px;
  --px3: 3px;
  --px4: 4px;
  --px5: 5px;
  --px6: 6px;
  --px7: 7px;
  --px8: 8px;
  --px9: 9px;
  --px10: 10px;
  --px11: 11px;
  --px12: 12px;
  --px13: 13px;
  --px14: 14px;
  --px15: 15px;
  --px16: 16px;
  --px17: 17px;
  --px18: 18px;
  --px19: 19px;
  --px20: 20px;
  --px21: 21px;
  --px22: 22px;
  --px23: 23px;
  --px24: 24px;
  --px25: 25px;
  --px26: 26px;
  --px27: 27px;
  --px28: 28px;
  --px29: 29px;
  --px30: 30px;
  --px31: 31px;
  --px32: 32px;
  --px33: 33px;
  --px34: 34px;
  --px35: 35px;
  --px36: 36px;
  --px37: 37px;
  --px38: 38px;
  --px39: 39px;
  --px40: 40px;
  --px41: 40px;
  --px42: 40px;
  --px43: 40px;
  --px44: 40px;
  --px45: 40px;
  --px46: 40px;
  --px47: 40px;
  --px48: 40px;
  --px49: 40px;
  --px50: 50px;
  --px60: 60px;
  --px70: 70px;
  --px80: 80px;
  --px90: 90px;
  --px100: 100px;
  --px110: 110px;
  --px120: 120px;

  --font-size-title: var(--px14);
  --font-size-desc: var(--px13);
  --font-size-idal: var(--px12);

  --block-radius: var(--px6);
  --block-padding: var(--px12);
  --block-margin: var(--px12);
}

// hide scroll-view scroll bar
scroll-view ::-webkit-scrollbar {
  appearance: none;
  color: transparent;
  display: none;
  width: 0;
  height: 0;
}

@font-face {
  font-family: 'DIN';
  src: url('data:font/ttf;charset=utf-8;base64,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') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
